<template>
  <div class="newsContainer">
    <!-- 新闻主标题 -->
    <h2 class="news-title">{{content.title}}</h2>

    <!-- 新闻副标题 -->
    <div class="news-pubtitle">
      <span>发布日期：{{content.pubdate}}</span>
      <span>版权：{{content.copyright}}</span>
    </div>

    <hr>

    <!-- 新闻正文 -->
    <div class="news-container">
      <span>{{content.content}}</span>
    </div>
    <!-- 评论区域 -->
    <CommitBox></CommitBox>   
  </div>
</template>


<script>
import Commit from '../Commit/Commit.vue'
export default {
  data() {
    return {
      id: this.$route.params.id,
      content: ''
    };
  },
  mounted() {
    this.axios.post('http://api.komavideo.com/news/list').then(body => {
      this.content = body.data[0];
    });
  },
components:{
    'CommitBox':Commit
}    

};
</script>



<style scoped>
.newsContainer {
  padding: 0 5px;
}
.news-title {
  height: 20px;
  font-size: 14px;
  text-align: center;
  line-height: 20px;
  color: #f00;
}
.news-pubtitle {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  /* padding: 0 4px; */
  color: blue;
}
.news-container {
  /* margin: 5px 5px; */
  font-size: 14px;
  text-indent: 2em;
  border: 1px solid rgba(0, 0, 0, 0.3);
  padding: 3px 3px;
  line-height: 20px;
  margin-bottom: 10px;
}

</style>
